/*
* @Date: 2021/3/5
* @Author: XueChengwu <xuechengwu@erayt.com>
* @Copyright: 2015-2019 Erayt, Inc.
* @Description: If you have some questions, please contact: xuechengwu@erayt.com.
*/
import React from 'react';
import { Form, Input, Switch, Select } from 'antd';
import { FormReceiver } from "../../../utils/FormReceiver";
const formItemLayout = {
  labelCol: {span: 4},
  wrapperCol: {span: 16}
}

export default class extends React.Component {
  render() {
    const { record, groups } = this.props;
    return (
      <Form>
        <Form.Item
          label="组件名称"
          { ...formItemLayout }
        >
          <Input onChange={ FormReceiver('name',record )} defaultValue={ record.name } />
        </Form.Item>
        <Form.Item
          label="标识"
          { ...formItemLayout }
        >
          <Input onChange={ FormReceiver('keyword',record )} defaultValue={ record.keyword } />
        </Form.Item>
        <Form.Item
          label="组别"
          { ...formItemLayout }
        >
          <Select
            allowClear
            onChange={ FormReceiver('keyword',record )}
            defaultValue={record.group}
          >
            {
              groups.map(vo => (
                <Select.Option value={vo.value}>{vo.label}</Select.Option>
              ))
            }
          </Select>
        </Form.Item>
        <Form.Item
          label="排序"
          { ...formItemLayout }
        >
          <Input onChange={ FormReceiver('sort',record )} defaultValue={ record.sort } />
        </Form.Item>
        <Form.Item
          label="模板"
          { ...formItemLayout }
        >
        </Form.Item>


        <Form.Item
          label="属性"
          { ...formItemLayout }
        >
        </Form.Item>
      </Form>
    )
  }
}
